<template>
  <div>
    <FormTable :formData="formData"
               :columnData="columnData"
               :editData="editData"
               :url="$api.game_gift_getlist"
               :new_url="this.$api.game_gift_insert"
               :detail_url="this.$api.game_gift_info"
               :edit_url="this.$api.game_gift_save"
               :is_default_edit="true"
               :is_show_new="false"
               :is_show_import="true"
               :import_config="import_config"
               :pageConfig="pageConfig"></FormTable>
  </div>
</template>

<script>
export default {
  data () {
    return {
      formData: [
        {
          name: 'gift_code',
          label: '礼包码',
          value: '',
          type: 'input'
        },
        {
          name: 'card_name',
          label: '卡券标题',
          value: '',
          type: 'input'
        },
        {
          name: 'user_nickname',
          label: '用户昵称',
          value: '',
          type: 'input'
        },
        {
          name: "display",
          label: "是否被领取",
          value: '',
          type: 'select',
          groups: [
            {
              label: '所有',
              value: ''
            },
            {
              label: '否',
              value: '0'
            },
            {
              label: '是',
              value: '1'
            },
          ]
        },
      ],
      columnData: [
        {
          prop: "game_gift_id",
          label: "id"
        },
        {
          prop: "gift_code",
          label: "游戏礼包码"
        },
        {
          prop: "card_name",
          label: "卡券标题"
        },
        {
          prop: "nickName",
          label: "用户昵称"
        },
        {
          prop: "display",
          label: "是否显示",
          custom: true,
          type: 'switch',
          url: this.$api.game_gift_status
        },
        {
          prop: "receive_time",
          label: "领取时间",
          width: '180px'
        },
        {
          prop: "end_time",
          label: "结束时间",
          width: '180px'
        },
        {
          prop: 'btn_group',
          label: '操作',
          custom: true,
          type: 'btn_group',
          width: '200px',
          group: [
            {
              name: '编辑',
              type: 'edit',
              color: 'primary',
              detail_mark: 'game_gift_id',
            },
          ]
        }
      ],
      editData: [
        {
          name: 'game_gift_id',
          label: '礼包码id',
          value: '',
          type: 'input',
          display: 'none'
        },
        {
          name: 'gift_code',
          label: '礼包码',
          value: '',
          type: 'input',
          rules: [
            { required: true, message: "请输入礼包码", trigger: "blur" },
          ]
        },
        {
          name: 'card_id',
          label: '卡券',
          value: '',
          type: 'select',
          groups: [],
          config: {
            filterable: true
          },
          rules: [
            { required: true, message: "请选择卡券", trigger: "blur" },
          ]
        },
        {
          name: 'batch',
          label: '发放批次',
          value: '',
          type: 'input',
          rules: [
            { required: true, message: "请输入发放批次", trigger: "blur" },
          ]
        },
        {
          name: "end_time",
          label: "结束时间",
          value: '',
          type: "date_time_picker",
          config: {
            type: 'datetime',
            format: 'yyyy-MM-dd',
            'value-format': 'yyyy-MM-dd',
          },
          rules: [
            { required: true, message: "请选择结束时间", trigger: "blur" },
          ]
        },
      ],
      import_config: {
        drag: true,
        action: this.$api.game_gift_execlImport,
        headers: {
          'authorization': localStorage.getItem('token')
        },
        accept:'.xls,.xlsx',
        message:'请上传Excel格式的文件'
      },
      pageConfig: {
        page: 1,
        pagesize: 10,
      }
    };
  },
  created () {
    this.getTopType();
  },
  methods: {
    getTopType () {
      this.$req.get(this.$api.card_getnopagelist).then(res => {
        let data = res.data;
        this.dataHandler(data, '', 2, 'name', 'card_id');
      })
    },
    dataHandler (data, idx1, idx2, labelKey, valueKey) {
      for (var i in data) {
        if (typeof idx1 == 'number') {
          this.formData[idx1].groups.push({
            label: labelKey ? data[i][labelKey] : data[i],
            value: valueKey ? data[i][valueKey] : data[i]
          })
        }
        this.editData[idx2].groups.push({
          label: labelKey ? data[i][labelKey] : data[i],
          value: valueKey ? data[i][valueKey] : data[i],
        })
      }
      console.log(this.editData)
    },
    handleSizeChange (e) {
      console.log(e);
    },
    handleCurrentChange (e) {
      console.log(e);
    },
    submit (e) {
      console.log(e);
    },
    reset (e) {
      console.log(e);
    }
  }
}
</script>

<style lang="scss" scoped>
</style>